import React, { useEffect, useState } from 'react';
import icons from '../../../../../public/board/machine-room-icons-2.png'
import style from '../board.css';


function CustomTable({ columns, data }){
    
    return (
        <table className={style['custom-table']}>
            <thead>
                <tr>
                {
                    columns.map((item, index)=>(
                        <th key={index}>
                            <div style={{ display:'flex', alignItems:'center', justifyContent:'center' }}>
                                <div style={{
                                    width:'24px',
                                    height:'24px',
                                    marginRight:'4px',
                                    backgroundRepeat:'no-repeat',
                                    backgroundSize:'cover',
                                    backgroundImage:`url(${icons})`,
                                    backgroundPosition:`-${index*24}px 0`
                                }}></div>
                                <div>{ item.title }</div>
                            </div>
                        </th>
                    ))
                }
                </tr>
            </thead>
            <tbody>
                {
                    data.map((item, index)=>(
                        <tr key={index}>
                            {
                                columns.map((col, j)=>(
                                    <td key={index + '-' + j}>
                                        <span 
                                            className={col.hasBg ? style['bg'] : ''}
                                            style={{ color:col.color ? col.color : 'inherit' }}
                                        >{ item[col.dataIndex] }</span>
                                    </td>
                                ))
                            }
                        </tr>
                    ))
                }
            </tbody>
        </table>
    )
}

export default CustomTable;